<!-- 提示信息 -->
<app-tip [type]="tipType"></app-tip>
<app-load *ngIf="isLoading"></app-load>
<!--详情查询的页面-->
  <div class="header">
    <div class="left flex" (click)="detailsClose()">
      <div class="left-icon">
        <i class="fa fa-times" aria-hidden="true" style="font-size: 1.5em;"></i>
      </div>
      <div class="left-name">
        <span class="back-name">关闭</span>
      </div>
    </div>
    <div class="center">服务生点单详情页</div>
  </div>
  <div class="main">
    <div class="search-box" style="margin-bottom: .5em;">
      <div class="search flex">
        <div class="start">开始时间：</div>
        <div class="input">
          <input type="date" class="search-input" [(ngModel)]="detailParams.startTime" value="">
        </div>
        <div class="text">
          <span class="clear-data" (click)="clearData1()">清除</span>
        </div>
      </div>
      <div style="height: 10px">&nbsp;</div>
      <div class="search flex" style="padding-bottom: .7em">
        <div class="start"> 结束时间：</div>
        <div class="input">
          <input type="date" class="search-input" [(ngModel)]="detailParams.endTime">
        </div>
        <div class="text">
          <span class="search-btn" (click)="getDetails(true, detailParams.uid)">搜索</span>
        </div>
      </div>
    </div>
    <div class="record-box" style="width: 100%;">
      <div *ngIf="detailList.length" class="title-text">详细信息</div>
      <div class="record-list" style="margin-bottom: .5em" *ngFor="let v of detailList">
        <div class="record-item flex">
          <div class="record-item-name">菜品名称</div>
          <div class="record-item-text">{{v.food_name}}</div>
        </div>
        <div class="record-item flex">
          <div class="record-item-name">菜品数量</div>
          <div class="record-item-text">{{v.num}}</div>
        </div>
        <div class="record-item flex">
          <div class="record-item-name">菜品单价</div>
          <div class="record-item-text">{{v.price | price}}</div>
        </div>
        <div class="record-item flex">
          <div class="record-item-name">总金额</div>
          <div class="record-item-text">{{v.total_price | price}}</div>
        </div>
      </div>
      <div class="no-data" *ngIf="!detailList.length && isFlagMore">
        <p class="load-data-description">
          <i class="fa fa-info-circle"></i> <span>暂无统计数据</span>
        </p>
      </div>
      <div class="load-more" *ngIf="totalPage > detailParams.start" (click)="loadMore()">
        <i class="fa fa-spinner fa-spin fa-fw"></i> <span>点击加载更多...</span>
      </div>
    </div>
  </div>
